﻿@using KingsSharp.Common.Extensions;
@{
    ViewBag.Title = "MenuNodeAdd";
}
@section head
{
    <script src="@Url.Content("~/ScriptPlugin/validate/validate.js")"></script>
    <link href="@Url.Content("~/ScriptPlugin/validate/validate.css")" rel="stylesheet" />
    <script type="text/javascript" src="@Url.Content("~/Scripts/form2json.js")"></script>
    <script src="@Url.Content("~/ScriptPlugin/color-spectrum/spectrum.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/ScriptPlugin/color-spectrum/jquery.spectrum-zh-cn.js")" type="text/javascript"></script>
    <link href="@Url.Content("~/ScriptPlugin/color-spectrum/spectrum.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/App_Themes/default/icons/iconcontent/iconfont.css")" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
        function SaveData(index)
        {
            if (K.Validate())
            {
                var dto=form2Json();
                K.AjaxJson("@Url.Content("~/Sys/Menu/MenuNodeInsert")",{ dtos: dto }, function (result) {
                    parent.K.layer.callback(index, result, dto);
                    parent.K.layer.close(index);
                });
            }
        }
    </script>
}
<form action="">
    <div class="content-form">
        <table class="content-table">
            <tr>
                <th><span>菜单名称</span></th>
                <td>
                    <input type="text" data-validate-option="isNull" id="Name" name="Name" />
                </td>
                <th><span>菜单归属</span></th>
                <td>
                    <select id="Type" name="Type" data-validate-option="isNull">
                        <option></option>
                        @{
                            string options = "";
                            typeof(SystemMenuType).Each((name, value, description) =>
                            {
                                options += "<option value=\"" + value + "\">" + description + "</option>";
                            });
                        }
                        @MvcHtmlString.Create(options)
                        @*<option value="0">物业系统总公司菜单</option>
                            <option value="1">物业系统项目菜单</option>
                            <option value="99">后台系统菜单</option>*@
                    </select>
                </td>
            </tr>
            <tr>
                <th><span>上级目录</span></th>
                <td>
                    <input type="text" id="PName" name="PName" class="p-icon-right p-icon-catalog" readonly="true" onclick="getParentCatolog()" />
                    <input type="hidden" id="Pid" name="Pid" />
                </td>
                <th><span>路径区域</span></th>
                <td>
                    <input type="text" id="Area" name="Area" data-validate-option="isNull" />
                    <input type="hidden" id="MenuURL" name="MenuURL" />
                </td>
            </tr>
            <tr>
                <th><span>控制器</span></th>
                <td>
                    <input type="text" id="Controller" name="Controller" data-validate-option="isNull" />
                </td>
                <th><span>视图方法</span></th>
                <td>
                    <input type="text" id="Action" name="Action" data-validate-option="isNull" />
                </td>
            </tr>
            <tr>
                <th>打开方式</th>
                <td>
                    <select id="MenuURLTarget" name="MenuURLTarget">
                        <option selected="selected" value="0">默认</option>
                        <option value="1">模态窗口</option>
                        <option value="2">新窗口</option>
                    </select>
                </td>
                <th>排序号</th>
                <td>
                    <input type="text" id="Order" value="0" name="Order" onkeypress="KingsSharp.OnlyNum();" />
                </td>
            </tr>
            <tr>
                <th>目录图标</th>
                <td>
                    <input type="hidden" id="IconText" name="IconText" value="&amp;#xe63d;" />
                    <div style="width:20px;height:20px;float:left;font-size:24px;">
                        <i id="tIconText" style="vertical-align:top;font-size:24px;margin-top:5px;padding:0;line-height:24px;color:#94A6C6" class="icon iconfont">&#xe63d;</i>
                    </div>
                    <button type="button" onclick="getIcon()" class="u-btn u-btn-c4" style="height:22px;line-height:22px;float:right;">选择...</button>
                </td>
                <th>图标颜色</th>
                <td>
                    <input type="text" value="#94A6C6" id="IconColor" name="IconColor" />
                </td>
            </tr>
            <tr>
                <th>功能权限组<input type="hidden" value="insert:新增,update:编辑,delete:删除" id="ActionPower" name="ActionPower" /></th>
                <td colspan="3">
                    <span class="power" id="powerpannel">
                        <span id="power_insert" class="insert">
                            新增<a onclick="powerDelete(this, 'insert:新增')">x</a>
                        </span>
                        <span id="power_update" class="update">
                            编辑<a onclick="powerDelete(this, 'update:编辑')">x</a>
                        </span>
                        <span id="power_delete" class="delete">
                            删除<a onclick="powerDelete(this, 'delete:删除')">x</a>
                        </span>
                    </span>

                    <button type="button" onclick="addPower()" class="u-btn u-btn-c4" style="height:22px;line-height:22px;float:right;">添加</button>
                </td>
            </tr>
            <tr>
                <th>菜单说明</th>
                <td colspan="3">
                    <input type="text" id="Description" name="Description" />
                </td>
            </tr>
            <tr style="height:100%">
                <td colspan="4" style="padding:1px 1px 0px 1px;vertical-align:top">
                    <div class="remark">
                        <div>1、当上级目录不为空时，目录类别将无法选择，自动根据上一级目录类别而产生。</div>
                        <div>2、菜单添加后将无法删除。</div>
                    </div>
                </td>
            </tr>
        </table>
    </div>
</form>
@section foot
{
    <script type="text/javascript">
        function getParentCatolog() {

            K.layer.iframe({
                title: "目录选择",
                initfull: false,
                content: "@Url.Content("~/Sys/Menu/MenuTree")",
                area: ["360px", "335px"],
                callback: function (node) {
                    $("#PName").val(node.Name);
                    $("#Pid").val(node.Id);
                    $("#Type").val(node.Type);
                    $("#Type").attr("disabled", "disabled");
                }
            });
        }
        function getIcon() {
            K.layer.iframe({
                title: "图标选择",
                initfull: false,
                content: "@Url.Content("~/Public/Icon")",
                area: ["440px", "395px"],
                callback: function (data) {
                    $("#tIconText").html(data.code);
                    $("#IconText").val(data.code);
                }
            });
        }
        $("#IconColor").spectrum({
           color: "#94A6C6",
           preferredFormat: "hex",
           showInput: true,
           change:function(color){
            $("#tIconText").css("color",color.toHexString());
           }
        });
        function addPower()
        {
            K.layer.iframe({
                title: "添加功能权限",
                initfull: false,
                content: "@Url.Content("~/Public/ActionPower")",
                area: ["480px", "305px"],
                callback: function (power) {
                    var powervalue = $("#ActionPower").val();
                    if (powervalue.indexOf(power.Code + ":" + power.Name) == -1) {
                        if (powervalue != "") {
                            powervalue += ",";
                        }
                        powervalue += power.Code + ":" + power.Name;
                        $("#ActionPower").val(powervalue);
                        $("#powerpannel").append("<span id=\"power_" + power.Code + "\" class=\"" + power.Code + "\">" + power.Name + "<a onclick=\"powerDelete(this, '" + power.Code + ":" + power.Name + "')\">x</a>");
                    }
                }
            });
        }
        function powerDelete(obj,val)
        {
            var powervalue = $("#ActionPower").val();
            var powerarr = powervalue.split(',');
            powervalue = "";
            for (var i = 0; i < powerarr.length; i++)
            {
                if(powerarr[i]!=val)
                {
                    if (powervalue != "") {
                        powervalue += ",";
                    }
                    powervalue = powervalue + powerarr[i];
                }
            }
            $("#ActionPower").val(powervalue);
            $(obj).parent().remove();
        }
    </script>
}